import iconList from './iconList'
import './iconChoose.scss'
import { t } from '@src/locales'

const iconChoose = {
    name: 'iconChoose',
    props: {
        value: {
            type: String,
            default: 'icon-caidan-liucheng'
        }
    },
    data() {
        return {
            icon: 'icon-caidan-liucheng',
            visible: false,
        }
    },
    created() {
        this.icon = this.value;
    },
    render(h) {
        return (
            <div class="iconChoose">
                <i
                    class={`iconfont ${this.icon} type-icon`}
                    slot={`reference`}
                ></i>
                <div class="iconChoose-right">
                    <div class="iconChoose-right-title">{t('setting.enterprise.quickEntrance.customLink.chooseIcon')}</div>
                    <div class="iconChoose-right-content">
                        {iconList.map(item => (
                            <i
                                class={`iconfont ${item.className} type-icon`}
                                onClick={() => {
                                    this.$emit('input', item.className)
                                    this.icon = item.className
                                    this.visible = false
                                }}
                            >
                            </i>
                        ))}
                    </div>
                </div>
            </div>
        )
    }
}

export default iconChoose;